<template>
    <view>
        <view class="commentlist" v-for="(item, index) in commentlist" :key="index">
            <view class="commentpic">
                <image :src="item.avatarUrl"></image>
            </view>

            <view class="commenttitle">
                <view class="addresstop">{{ item.wechaname }}</view>
                <view class="addresstop" style="font-size: 0.7rem; color: #ff553c">
                    <block v-if="item.score == 1"><text class="fa fa-star fa-lg"></text></block>
                    <block v-if="item.score == 2">
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                    </block>
                    <block v-if="item.score == 3">
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                    </block>
                    <block v-if="item.score == 4">
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                    </block>
                    <block v-if="item.score == 5">
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                        <text class="fa fa-star fa-lg"></text>
                    </block>
                </view>
                <view class="content">对 【{{ item.companyname }}】评论: '{{ item.content }}'</view>

                <block v-if="item.piclist">
                    <view class="piclist">
                        <image :src="itempic" style="width: 160rpx; height: 160rpx" v-for="(itempic, index1) in item.piclist" :key="index1"></image>
                    </view>
                </block>

                <view class="time">
                    <view>{{ item.create_time }}</view>
                    <view @tap="delComment" :data-id="item.id">删除</view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import { Company } from '../../model/company-model.js';
var company = new Company();
export default {
    data() {
        return {
            commentlist: ''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        this.onLoadClone3389(options);
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        /**
         * 生命周期函数--监听页面加载
         */
        onLoadClone3389: function (options) {
            var that = this;
            uni.setNavigationBarTitle({
                title: '我的评论管理'
            });
            var params = {};
            company.getMyComment((data) => {
                that.setData({
                    commentlist: data.commentlist
                });
            }, params);
        },

        delComment: function (e) {
            var that = this;
            var id = e.currentTarget.dataset.id;
            var params = {
                id: id
            };
            uni.showModal({
                title: '提示',
                content: '确定删除该条评论？',
                success: function (res) {
                    if (res.confirm) {
                        company.delComment((data) => {
                            if (data.status == 0) {
                                uni.showModal({
                                    title: '提示',
                                    content: data.msg,
                                    showCancel: false,
                                    success: function () {
                                        that.onLoadClone3389({});
                                    }
                                });
                            } else {
                                uni.showToast({
                                    title: data.msg,
                                    icon: 'none',
                                    duration: 2000
                                });
                            }
                        }, params);
                    }
                }
            });
        },

        toSetComment: function (e) {
            var id = e.currentTarget.dataset.id;
            uni.navigateTo({
                url: '/pages/setcomment/index?id=' + id
            });
        },

        toJob: function (e) {
            var pid = e.currentTarget.dataset.id;
            uni.navigateTo({
                url: '/pages/jobdetail/index?id=' + pid
            });
        }
    }
};
</script>
<style>
.commentlist {
    display: flex;
    flex-direction: row;
    width: 720rpx;
    margin: 0 auto;
    border-bottom: 1px solid #efefef;
    padding-top: 30rpx;
    padding-bottom: 30rpx;
}
.commentlist .commentpic {
    width: 20%;

    justify-content: center;
    display: flex;
}
.commentlist .commentpic image {
    width: 100rpx;
    height: 100rpx;
    border-radius: 50rpx;
}

.commentlist .commenttitle {
    width: 75%;
    flex-direction: column;
    display: flex;
    justify-content: space-between;
    padding-top: 5rpx;
}

.commentlist .commenttitle .addresstop {
    padding-left: 5%;
    width: 100%;
    font-size: 0.8rem;
    color: #000;
}
.commentlist .commenttitle .content {
    margin-top: 20rpx;
    padding-left: 5%;
    text-align: left;
    font-size: 0.9rem;
    color: #767988;
}

.piclist {
    margin-top: 20rpx;
    padding-left: 5%;
    text-align: left;
    font-size: 0.9rem;
    color: #000;

    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.piclist > image {
    width: 150rpx;
    height: 150rpx;
    margin-right: 10rpx;
}

.commentlist .commenttitle .gomore {
    margin-top: 20rpx;
    padding-left: 5%;
    text-align: left;
    font-size: 0.8rem;
    color: #767988;
}
.commentlist .commenttitle .time {
    margin-top: 20rpx;
    padding-left: 5%;
    text-align: left;
    font-size: 0.7rem;
    color: #9b9b9b;
    display: flex;
    justify-content: space-between;
}
.time view:nth-child(2) {
    background-color: red;
    width: 120rpx;
    color: #fff;
    font-size: 12px;
    padding: 8rpx;
    text-align: center;
    border-radius: 30rpx;
}
</style>
